<template>
	<view>
		<view class="card">
			<view class="left">
				<image src="../../static/logo.png" mode=""></image>
				<view class="content">
					<text style="display: block;font-size: 30rpx;">张三丰</text>
					<view style="margin-top: 5rpx;">
						<image src="../../static/img/xx.png" mode=""></image>
						<image src="../../static/img/xx.png" mode=""></image>
						<image src="../../static/img/xx.png" mode=""></image>
						<image src="../../static/img/xx.png" mode=""></image>
					</view>
				</view>
			</view>
			<view class="right">
				<u-button type="primary" class="custom-style-fill" shape="circle" size="mini">
					<u-icon name="plus-circle"></u-icon>
					关注
				</u-button>
			</view>
		</view>
		<view class="box">
			<text class="title">讲师评价</text>
			<view class="p-row">
				<text>1、你的人生目标是怎么样的？</text>
				<view class="rad">
					<u-radio-group v-model="value" @change="radioGroupChange">
						<u-radio class="ad" @change="radioChange" v-for="(item, index) in list" :key="index" :name="item.name" :disabled="item.disabled">{{ item.name }}</u-radio>
					</u-radio-group>
				</view>
			</view>
			<view class="p-row">
				<text>2、你的人生目标是怎么样的？</text>
				<view class="rad">
					<u-radio-group v-model="value" @change="radioGroupChange">
						<u-radio class="ad" @change="radioChange" v-for="(item, index) in list" :key="index" :name="item.name" :disabled="item.disabled">{{ item.name }}</u-radio>
					</u-radio-group>
				</view>
			</view>
			<view class="p-row">
				<text>3、你的人生目标是怎么样的？</text>
				<view class="rad">
					<u-radio-group v-model="value" @change="radioGroupChange">
						<u-radio class="ad" @change="radioChange" v-for="(item, index) in list" :key="index" :name="item.name" :disabled="item.disabled">{{ item.name }}</u-radio>
					</u-radio-group>
				</view>
			</view>
			<text class="title">照片/视频</text>
			<view class=""><u-upload :action="action"></u-upload></view>
			<text class="title">备注</text>
			<u-input class="bg" v-model="value1" type="textarea" :border="true" :height="150" :auto-height="true" />
			<u-button class="btn" type="primary" shape="circle" @click="submit">提交</u-button>
			<!-- 提交成功的弹窗 -->
			<u-modal v-model="show" :show-title="false" width="70%" :show-confirm-button="false">
				<view class="slot-content">
					<image class="pj" src="../../static/img/pj.png" mode=""></image>
					<view class="success"><text>评价成功</text></view>
					<u-button @click="ok" size="medium" type="primary" shape="circle" plain>好的，我知道了</u-button>
				</view>
			</u-modal>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			list: [
				{
					name: '是',
					disabled: false
				},
				{
					name: '否',
					disabled: false
				}
			],
			value: '是',
			value1: '',
			// 演示地址，请勿直接使用
			action: 'http://www.example.com/upload',
			show: false
		};
	},
	methods: {
		// 选中某个单选框时，由radio时触发
		radioChange(e) {
			// console.log(e);
		},
		// 选中任一radio时，由radio-group触发
		radioGroupChange(e) {
			// console.log(e);
		},
		submit() {
			this.show = true;
		},
		ok(){
			this.show = false;
		}
	}
};
</script>

<style lang="scss">
@import './period.scss';
</style>
